<template>
  <div>
    <a-form
      id="components-form-demo-normal-login"
      :form="form"
      class="login-form"
      @submit="handleSubmit"
    >
      <a-form-item>
        <a-input
          v-decorator="[
            'userName',
            { rules: [{ required: true, message: 'Please input your username!' }] },
          ]"
          placeholder="Username"
        >
          <a-icon slot="prefix" type="user" style="color: rgba(0,0,0,.25)" />
        </a-input>
      </a-form-item>
      <a-form-item>
        <a-input
          v-decorator="[
            'password',
            { rules: [{ required: true, message: 'Please input your Password!' }] },
          ]"
          type="password"
          placeholder="Password"
        >
          <a-icon slot="prefix" type="lock" style="color: rgba(0,0,0,.25)" />
        </a-input>
      </a-form-item>
      <a-form-item>


        <a-button type="primary" html-type="submit" class="login-form-button">
          Log in
        </a-button>

      </a-form-item>
    </a-form>
  </div>
</template>

<script>
import {postAction} from "../../../api/api";
import {baseUrlAdmin} from "../../../api_server/common/config";
import {setLocalUser} from "../../../api_server/common/utils/userUtils";

export default {
    beforeCreate() {
        this.form = this.$form.createForm(this, { name: 'normal_login' });
    },
    methods: {
        handleSubmit(e) {
            e.preventDefault();
            let that=this;
            this.form.validateFields((err, values) => {
                if (!err) {
                    postAction("/api/login",values).then(res=>{
                            that.$notification.success({ description: '登录成功!',duration: 2});
                            setLocalUser(res.result);
                            setTimeout(() => {
                                this.$router.replace({ path:baseUrlAdmin })
                            }, 1000);
                    })
                }
            });
        },
    },
};
</script>
<style>
  body{

  }
  #components-form-demo-normal-login  {
    width: 300px;
    height: 300px;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }
  #components-form-demo-normal-login .login-form-button {
    width: 100%;
  }
</style>
